import TmButton from 't/basic/button'
import TmIcon from 't/basic/icon'
import TmCheckbox from 't/basic/checkbox'
import TmCheckboxGroup from 't/basic/checkbox-group'
import TmList from 't/basic/list'
import TmSelect from 't/basic/select'
import TmPopup from 't/basic/dialog'
import TmSteps from 't/basic/stepper'
import {FilterExpression} from '../../covert'
import {
  useQuasar
} from '@teld/q-components';
import { defineComponent, ref, toRefs, watch } from 'vue';
export default defineComponent({
  name: 'SubWarning',
  components: {
    TmIcon,
    TmPopup,
    TmSteps,
    TmSelect,
    TmList,
    TmCheckboxGroup,
    TmCheckbox,
    TmButton
  },
  props: {
    modifyPlan: Object,
    currectPlan: String,
    filter: Object,
    showSubWarning: Boolean,
    pageID: String,
    dataQuery: String,
    filterServer: Array,
    pageName: String,
    pageCode: String,
    targetDom:Element
  },
  setup(props, { emit }) {
    const $q = useQuasar();
    const {
      showSubWarning,
      modifyPlan,
      pageID,
      dataQuery,
      filterServer,
      pageName,
      pageCode,
      targetDom
    } = toRefs(props);
    const active = ref(1);
    const isReadOnly = ref(false);
    const WarnSubObj = ref({
      Name: '', // 订阅名称
      Description: '', // 订阅名称
      SourceType: 0, // 默认
      SourceID: '', // 查询方案id
      SourceName: '', //查询方案名称
      IsEnable: true, // 默认true
      JSContent: '', // DQ数据源
      JSContentParams: '', // DQ的过滤条件
      IsBasic: false, // 默认false
      ReturnType: 11, // 默认11
      BusinessType: '', // 界面的Code
      BusinessName: '', // 界面的名称
      LinkUrl: '', // 当前界面的地址document.URL
      TriggerType: 1, // 订阅条件
      ComplexTriggerCondition: '',
      ComplexTriggerConditionView: {
        //订阅条件 == 3自定义 时
        CompareOperation: 0, // 条件
        CompareValue: 1, // 预期值
      },
      NoticeSet: {
        SortOrder: 0, // 默认0
        NoticeType: '', // 通知范围
        SubscriptionNoticeDefinitionID: '', // 通知方式ID
        NoticeContentType: '0',
        NoticeContent: '', // 通知内容
        TokenInfo: '', // Token
        SecretInfo: '', // Secrect
        IsNeedAtPerson: false, // 是否通知并@人员
        PersonField: '', // 字段Code
      },
      NoticeSets: [],
      //订阅频率
      ExecuteFrequency: {
        SysFrequencies: [],
      },
      WarnSubRateDay: '', //Terms.warnSub.WarnSubRateDay,
      WarnSubRateHour: '9:00',
      QueryPlanID: '',
    });
    watch(
      () => modifyPlan.value,
      () => {
        isReadOnly.value = modifyPlan.value.WarningID;
        if (!isReadOnly.value) {
          WarnSubObj.value.plan = modifyPlan.value;
          WarnSubObj.value.Name = modifyPlan.value.Name + $q.lang.queryPlan.subWarning.warnName;
          WarnSubObj.value.SourceID = modifyPlan.value.ID;
          WarnSubObj.value.SourceName = modifyPlan.value.Name;
        }
      },
      {
        immediate: true,
      },
    );
    const GetSysExecuteFrequencies = () => {
      return TFF.common.ajax.getDataAsync({
        url: `${Funcs.FasRequestTagAdd(
          TFF.common.ajax.getServiceUrl('FASR-GetSysExecuteFrequencies'),
        )}`,
        type: 'post',
        data: null,
      });
    };
    // 创建计划任务订阅
    const CreateScheduleJobSubscription = subscription => {
      return TFF.common.ajax.getDataAsync({
        url: `${Funcs.FasRequestTagAdd(
          TFF.common.ajax.getServiceUrl('FASR-CreateScheduleJobSubscription'),
        )}`,
        type: 'post',
        data: {
          subscription: JSON.stringify(subscription),
        },
      });
    };
    const GetNoticeScopeSets = () => {
      if (!window.TFF) {
        return Promise.resolve({
          state: '1',
          message: $q.lang.queryPlan.subWarning.saveSuccess,
          data: false,
        });
      }
      if (!window.GetNoticeScopeSetsProxy) {
        window.GetNoticeScopeSetsProxy = TFF.common.ajax.getDataAsync({
          url: `${Funcs.FasRequestTagAdd(
            TFF.common.ajax.getServiceUrl('FASR-GetNoticeScopeSets'),
          )}`,
          type: 'post',
          data: null,
        });
      }
      if (window.GetNoticeScopeSetsProxy instanceof Promise) {
        return window.GetNoticeScopeSetsProxy;
      } else {
        return Promise.resolve(window.GetNoticeScopeSetsProxy);
      }
    };
    const CancleScheduleJobSubscription = subscriptionID => {
      return TFF.common.ajax.getDataAsync({
        url: `${Funcs.FasRequestTagAdd(
          TFF.common.ajax.getServiceUrl('FASR-CancleScheduleJobSubscription'),
        )}`,
        type: 'post',
        data: {
          subscriptionID: subscriptionID,
        },
      });
    };

    const formatToObject = data => {
      if (!data.map) return [];
      return data.map((element, index) => {
        return {
          label: element,
          value: element,
        };
      });
    };
    const formatObjectToArray = data => {
      if (!(data instanceof Object)) return [];
      let res = [];
      for (let i in data) {
        res.push({
          label: data[i],
          value: i,
        });
      }
      return res;
    };
    const settingConfig = ref({
      SubscriptionNoticeContentType: [],
      SubscriptionNoticeSets: [],
      DayValue: [],
      HourValue: [],
      NoticesDefines: [],
    });
    let NoticesDefines = {};
    const GetScheduleJobSubscriptionById = subscriptionID => {
      return TFF.common.ajax.getDataAsync({
        url: `${Funcs.FasRequestTagAdd(
          TFF.common.ajax.getServiceUrl('FASR-GetScheduleJobSubscriptionById'),
        )}`,
        type: 'post',
        data: {
          subscriptionID: subscriptionID,
        },
      });
    };
    
    const renderBasicInfo = isNotCreate => {
      return (
        <div
          class={
            isNotCreate
              ? 'subwarning_basicInfo subwarning_basicInfo_height_Auto'
              : 'subwarning_basicInfo'
          }
        >
          <p>
            <span>{ $q.lang.queryPlan.subWarning.subWarningName}</span>
            <t-input
             class={isNotCreate?'tr-input-readonly':''}
                      tabIndex={isNotCreate?'-1':'0'}
            borderType='borderless'
              type='text'
              {...(isReadOnly.value ? { readonly: true } : {})}
              v-model={WarnSubObj.value.Name}
            />
          </p>
          <p>
            <span>{ $q.lang.queryPlan.subWarning.functionName}</span>
            <t-input borderType='borderless' type='text' readonly v-model={pageName.value}  />
          </p>
          <p>
            <span>{ $q.lang.queryPlan.dialog.planName}</span>
            <t-input borderType='borderless' type='text' readonly v-model={WarnSubObj.value.SourceName} />
          </p>
        </div>
      );
    };
    const WarnSubConditionOptions = [
      { value: 1, label: $q.lang.queryPlan.subWarning.WarnSubConditionOptions[0]},
      { value: 2, label: $q.lang.queryPlan.subWarning.WarnSubConditionOptions[1] },
      { value: 3, label: $q.lang.queryPlan.subWarning.WarnSubConditionOptions[2] },
    ];
    const WarnSubDataConditionOptions = [
      { value: 0, label: $q.lang.dataGrid.filterOperation.greaterThan  },
      { value: 1, label: $q.lang.dataGrid.filterOperation.lessThan  },
      { value: 2, label: $q.lang.dataGrid.filterOperation.equal  },
      { value: 3, label: $q.lang.dataGrid.filterOperation.notEqual },
      { value: 4, label: $q.lang.dataGrid.filterOperation.lessThanOrEqual},
      { value: 5, label: $q.lang.dataGrid.filterOperation.greaterThanOrEqual},
    ];

    const renderSubInfo = isNotCreate => {
      //FASR-GetNoticeScopeSets
      /**
       * 订阅条件
       *  WarnSubConditionOptions: [
        { value: 1, label: '数据条数大于0时' },
        { value: 2, label: '数据条数小于0时' },
        { value: 3, label: '自定义' },
      ],
      WarnSubDataConditionOptions: [
        { value: 0, label: Terms.warnSub.moreThan },
        { value: 1, label: Terms.warnSub.lessThan },
        { value: 2, label: Terms.warnSub.equal },
        { value: 3, label: Terms.warnSub.notEqual },
        { value: 4, label: Terms.warnSub.notMoreThan },
        { value: 5, label: Terms.warnSub.notLessThan },
      ],
       */
      return (
        <div
          class={
            isNotCreate
              ? 'subwarning_basicInfo subwarning_basicInfo_height_Auto'
              : 'subwarning_basicInfo'
          }
        >
          <p>
            <span>{$q.lang.queryPlan.subWarning.subCondition}</span>
            <tm-select
   class={isNotCreate?'tr-input-readonly subCondition ':' subCondition'}
                      tabIndex={isNotCreate?'-1':'0'}
              v-model={WarnSubObj.value.TriggerType}
              hideLabel={true}
              label={$q.lang.queryPlan.subWarning.choise}
              title={$q.lang.queryPlan.subWarning.choise}
              HelpPlacement='bottom'
              placeholder={$q.lang.queryPlan.subWarning.choise}
              staticItems={WarnSubConditionOptions}

              textAlign='left'
         
              itemsDataSourceType='static'
              {...(isReadOnly.value ? { readonly: true } : {})}
            />
          </p>
          {(() => {
            if (WarnSubObj.value.TriggerType == 3) {
              return (
                <p>
                  <span>{$q.lang.queryPlan.subWarning.dataNum}</span>
                  <div class='subConditionDataNumber'>
                    <tm-select
                     class={isNotCreate?'tr-input-readonly subCondition':' subCondition'}
                      tabIndex={isNotCreate?'-1':'0'}
                      v-model={
                        WarnSubObj.value.ComplexTriggerConditionView
                          .CompareOperation
                      }
                      hideLabel={true}
                      label={$q.lang.queryPlan.subWarning.choise}
                      title={$q.lang.queryPlan.subWarning.choise}
                      HelpPlacement='bottom'
                      placeholder={$q.lang.queryPlan.subWarning.choise}
                     staticItems={WarnSubDataConditionOptions}
                      textAlign='left'
                      class=' subCondition'
                      itemsDataSourceType='static'
                      {...(isReadOnly.value ? { readonly: true } : {})}
                    />
                    <t-input
                      type='text'
                      style='margin-top:0'
                      class={isNotCreate?'tr-input-readonly':''}
                      tabIndex={isNotCreate?'-1':'0'}
                      borderType='borderless'
                      {...(isReadOnly.value ? { readonly: true } : {})}
                      v-model={
                        WarnSubObj.value.ComplexTriggerConditionView
                          .CompareValue
                      }
                    />
                  </div>
                </p>
              );
            }
          })()}
          {(() => {
            if (!isNotCreate)
              return (
                <p>
                  <span>{$q.lang.queryPlan.subWarning.subRate}</span>
                  <div class='subConditionDataNumber'>
                    <tm-select
                     class={isNotCreate?'tr-input-readonly subCondition':' subCondition'}
                      tabIndex={isNotCreate?'-1':'0'}
                      v-model={WarnSubObj.value.WarnSubRateDay}
                      hideLabel={true}
                      label={$q.lang.queryPlan.subWarning.choise}
                      title={$q.lang.queryPlan.subWarning.choise}
                      HelpPlacement='bottom'
                      placeholder={$q.lang.queryPlan.subWarning.choise}
                      staticItems={settingConfig.value.DayValue}
                      itemsDataSourceType='static'
                      textAlign='left'
                   
                      {...(isReadOnly.value ? { readonly: true } : {})}
                    />
                    <tm-select
                      class={isNotCreate?'tr-input-readonly subCondition':' subCondition'}
                      tabIndex={isNotCreate?'-1':'0'}
                      v-model={WarnSubObj.value.WarnSubRateHour}
                      hideLabel={true}
                      label={$q.lang.queryPlan.subWarning.choise}
                      title={$q.lang.queryPlan.subWarning.choise}
                      HelpPlacement='bottom'
                      itemsDataSourceType='static'
                      placeholder={$q.lang.queryPlan.subWarning.choise}
                      staticItems={settingConfig.value.HourValue}

                      textAlign='left'
                     
                      {...(isReadOnly.value ? { readonly: true } : {})}
                    />

                    <i
                      class='icon-icon-fasplus'
                      style='margin-left:6px'
                      tabindex="0"
                      onkeydown={(e) => {
                        if(e.keyCode==13){
                          e.target.click()
                        }
                      }}
                      onClick={async () => {
                        if (isReadOnly.value) return;
                        if (
                          WarnSubObj.value.ExecuteFrequency.SysFrequencies.some(
                            item =>
                              WarnSubObj.value.WarnSubRateDay ==
                                item.DayValue &&
                              WarnSubObj.value.WarnSubRateHour ==
                                item.HourValue,
                          )
                        ) {
                          return;
                        }
                        GetSysExecuteFrequencies().then(
                          WarnSubSysFrequencies => {
                            let sysFrequencyObj =
                              WarnSubSysFrequencies.data.find(
                                frequency =>
                                  frequency.DayValue ==
                                    WarnSubObj.value.WarnSubRateDay &&
                                  frequency.HourValue ==
                                    WarnSubObj.value.WarnSubRateHour,
                              );
                            if (!sysFrequencyObj)
                                return Funcs.Notify($q.lang.selectHelper.warning, $q.lang.queryPlan.subWarning.subRateIsTemp, 'warning')

                            //@ts-ignore
                            WarnSubObj.value.ExecuteFrequency.SysFrequencies.push(
                              {
                                ID: sysFrequencyObj.ID,
                                CronExpression: sysFrequencyObj.CronExpression,
                                FrequencyContent:
                                  sysFrequencyObj.FrequencyContent,
                                DayValue: WarnSubObj.value.WarnSubRateDay,
                                HourValue: WarnSubObj.value.WarnSubRateHour,
                              },
                            );
                          },
                        );
                      }}
                    ></i>
                  </div>
                </p>
              );
          })()}

          <div class='subList'>
            <tm-list finished={true}>
              <div>
                <p>
                  <span>{$q.lang.queryPlan.subWarning.order}</span>
                  <span>{$q.lang.queryPlan.subWarning.day}</span>
                  <span>{$q.lang.queryPlan.subWarning.hour}</span>
                  {(() => {
                    if (!isNotCreate) return <span>{$q.lang.queryPlan.subWarning.operate}</span>;
                  })()}
                </p>
              </div>
              <div>
                {(() => {
                  let Template = [];
                  if (
                    WarnSubObj.value.ExecuteFrequency.SysFrequencies &&
                    WarnSubObj.value.ExecuteFrequency.SysFrequencies.length > 0
                  ) {
                    WarnSubObj.value.ExecuteFrequency.SysFrequencies.forEach(
                      (ele, index) => {
                        Template.push(
                          <p>
                            <span>{index + 1}</span>
                            <span>
                              {
                                settingConfig.value.DayValue.find(
                                  item => item.value == ele.DayValue,
                                ).label
                              }
                            </span>

                            <span>
                              {
                                settingConfig.value.HourValue.find(
                                  item => item.value == ele.HourValue,
                                ).label
                              }
                            </span>

                            {(() => {
                              if (!isNotCreate)
                                return (
                                  <span>
                                    <i class={'fas dx-icon icon-t-delete-outlined'}  onClick={() => {
                                      WarnSubObj.value.ExecuteFrequency.SysFrequencies =
                                        WarnSubObj.value.ExecuteFrequency.SysFrequencies.filter(
                                          frequency =>
                                            !(frequency.DayValue ==
                                              ele.DayValue &&
                                            frequency.HourValue ==
                                              ele.HourValue)
                                        );
                                      }}></i>

                                  </span>
                                );
                            })()}
                          </p>,
                        );
                      },
                    );
                  }
                  return Template;
                })()}
              </div>
            </tm-list>
          </div>
        </div>
      );
    };
    const WarnSubObj_NoticeContent = ref('');
    const NoticeContent = () => {
      if (!NoticesDefines.find) return;
      //WarnSubObj.value.NoticeSet.SubscriptionNoticeDefinitionID === >settingConfig.value.NoticesDefines
      //WarnSubObj.value.NoticeSet.NoticeContentType === >settingConfig.value.SubscriptionNoticeContentType
      let NoticesDefines_Target = NoticesDefines.find(
        item =>
          item.ID == WarnSubObj.value.NoticeSet.SubscriptionNoticeDefinitionID,
      );
      WarnSubObj.value.NoticeSet.NoticeContentType == 1
        ? (WarnSubObj.value.NoticeSet.NoticeContent =
            NoticesDefines_Target.MarkdownTemplate)
        : (WarnSubObj.value.NoticeSet.NoticeContent =
            NoticesDefines_Target.SimpleMarkdownTemplate);
      return (WarnSubObj_NoticeContent.value =
        WarnSubObj.value.NoticeSet.NoticeContent);
    };
    watch(
      () => WarnSubObj.value.NoticeSet.SubscriptionNoticeDefinitionID,
      () => {
        NoticeContent();
      },
      {
        deep: true,
        immediate: true,
      },
    );
    watch(
      () => WarnSubObj.value.NoticeSet.NoticeContentType,
      () => {
        NoticeContent();
      },
      {
        deep: true,
        immediate: true,
      },
    );
    watch(
      () => showSubWarning.value,
      () => {

        if (showSubWarning.value) {
          GetNoticeScopeSets().then(res => {
            window.GetNoticeScopeSetsProxy = res;
            res = res.data;
            if (!res) return;
            NoticesDefines = res.NoticesDefines;
            settingConfig.value.SubscriptionNoticeContentType =
              formatObjectToArray(res.SubscriptionNoticeContentType);
            WarnSubObj.value.NoticeSet.NoticeContentType
              ? ''
              : (() => {
                  WarnSubObj.value.NoticeSet.NoticeContentType =
                    settingConfig.value.SubscriptionNoticeContentType[0].value;
                  WarnSubObj.value.NoticeSet.NoticeContent =
                    res.NoticesDefines[0].MarkdownTemplate;
                })();

            settingConfig.value.SubscriptionNoticeSets = formatObjectToArray(
              res.SubscriptionNoticeSets,
            );
            WarnSubObj.value.NoticeSet.NoticeType != ''
              ? ''
              : (WarnSubObj.value.NoticeSet.NoticeType =
                  settingConfig.value.SubscriptionNoticeSets[0].value);
            settingConfig.value.DayValue = formatToObject(
              res.SysSubscriptionFrequencies.DayValue,
            );
            settingConfig.value.HourValue = formatToObject(
              res.SysSubscriptionFrequencies.HourValue,
            );
            settingConfig.value.NoticesDefines = res.NoticesDefines.map(
              item => {
                return {
                  NoticeScope: item.NoticeScope,
                  label: item.Name,
                  value: item.ID,
                };
              },
            );

            WarnSubObj.value.NoticeSet.SubscriptionNoticeDefinitionID
              ? ''
              : (WarnSubObj.value.NoticeSet.SubscriptionNoticeDefinitionID =
                  settingConfig.value.NoticesDefines.filter(
                    kk =>
                      kk.NoticeScope == WarnSubObj.value.NoticeSet.NoticeType,
                  )[0].value);
            WarnSubObj.value.WarnSubRateDay =
              settingConfig.value.DayValue[0].value;
            WarnSubObj.value.WarnSubRateHour =
              settingConfig.value.HourValue[0].value;
            //SubscriptionNoticeContentType
            //SubscriptionNoticeSets
            //SysSubscriptionFrequencies
            //    DayValue
            //    HourValue
            NoticeContent();
            if (modifyPlan.value.WarningID) {
              GetScheduleJobSubscriptionById(modifyPlan.value.WarningID).then(
                res => {
                  if (res.data) {
                    res.data.NoticeSet = res.data.NoticeSets[0];
                    if (!res.data.ComplexTriggerConditionView) {
                      res.data.ComplexTriggerConditionView =
                        WarnSubObj.value.ComplexTriggerConditionView;
                    }
                    res.data.NoticeSet.NoticeType = res.data.NoticeSet
                      .SubscriptionNoticeDefinition
                      ? res.data.NoticeSet.SubscriptionNoticeDefinition
                          .NoticeScope + ''
                      : '0';
                    res.data.ComplexTriggerCondition = JSON.parse(
                      res.data.ComplexTriggerCondition,
                    );
                    WarnSubObj.value = res.data;
                    WarnSubObj.value.plan = modifyPlan.value;
                  } else {
                    if (!modifyPlan.value.IsAuth) {
                      delete modifyPlan.value.WarningID;
                      emit('update:showSubWarning', false);
                      return Funcs.Notify($q.lang.selectHelper.warning,$q.lang.queryPlan.subWarning.getSubWarningFail, 'warning')

                    }
                    if (modifyPlan.value.IsAuth) {
                      //  emit('update:showSubWarning', false);
                      delete modifyPlan.value.WarningID;
                      WarnSubObj.value.plan = modifyPlan.value;
                      WarnSubObj.value.Name =
                        modifyPlan.value.Name + $q.lang.queryPlan.subWarning.warnName ;
                      WarnSubObj.value.SourceID = modifyPlan.value.ID;
                      WarnSubObj.value.SourceName = modifyPlan.value.Name;
                      isReadOnly.value = false;

                      return Funcs.Notify($q.lang.selectHelper.warning,$q.lang.queryPlan.subWarning.getSubWarningFailToRety, 'warning')

                    }
                  }
                },
              );
            }
          });
        }
      },
      { immediate: true },
    );
    const renderNotifyInfo = isNotCreate => {
      return (
        <div
          class={
            isNotCreate
              ? 'subwarning_basicInfo subwarning_basicInfo_height_Auto'
              : 'subwarning_basicInfo'
          }
        >
          <p>
            <span>{$q.lang.queryPlan.subWarning.notice}</span>
            <div class='subConditionDataNumber'>
              <tm-select
          class={isNotCreate?'tr-input-readonly subCondition':' subCondition'}
                      tabIndex={isNotCreate?'-1':'0'}
                v-model={WarnSubObj.value.NoticeSet.NoticeType}
                hideLabel={true}
               label={$q.lang.queryPlan.subWarning.choise}
                title={$q.lang.queryPlan.subWarning.choise}
                HelpPlacement='bottom'
                placeholder={$q.lang.queryPlan.subWarning.choise}
               staticItems={settingConfig.value.SubscriptionNoticeSets}
                itemsDataSourceType='static'

                textAlign='left'
           
                {...(isReadOnly.value ? { readonly: true } : {})}
                onConfirm={() => {

                  WarnSubObj.value.NoticeSet
                    .SubscriptionNoticeDefinitionID=  settingConfig.value.NoticesDefines.filter(
                      jj =>
                        jj.NoticeScope ==
                        WarnSubObj.value.NoticeSet.NoticeType,
                    )[0].value
                }}
              />
              {(() => {
                if (WarnSubObj.value.NoticeSet.NoticeType == 0) {
                  return (
                    <tm-select
                      v-model={
                        WarnSubObj.value.NoticeSet
                          .SubscriptionNoticeDefinitionID
                      }
                      class={isNotCreate?'tr-input-readonly subCondition':' subCondition'}
                      tabIndex={isNotCreate?'-1':'0'}
                      onConfirm={NoticeContent}
                      itemsDataSourceType='static'
                      hideLabel={true}
                      label={$q.lang.queryPlan.subWarning.choise}
                      title={$q.lang.queryPlan.subWarning.choise}
                      HelpPlacement='bottom'
                      placeholder={$q.lang.queryPlan.subWarning.choise}
                     staticItems={(() => {
                        return settingConfig.value.NoticesDefines.filter(
                          jj =>
                            jj.NoticeScope ==
                            WarnSubObj.value.NoticeSet.NoticeType,
                        );
                      })()}

                      textAlign='left'
                
                      {...(isReadOnly.value ? { readonly: true } : {})}
                    />
                  );
                }
              })()}
            </div>
          </p>
          {(() => {
            if (!isReadOnly.value) {
              return (
                <p>
                  <span>{$q.lang.queryPlan.subWarning.noticeTemplate}</span>
                  {/* {WarnSubObj.value.NoticeSet.NoticeContentType}
                  {typeof WarnSubObj.value.NoticeSet.NoticeContentType}
            {JSON.stringify(WarnSubObj.value.NoticeSet)}
            -----------------------------------------------
            {JSON.stringify(settingConfig.value.SubscriptionNoticeContentType)} */}
                  <div class='subConditionDataNumber' style='width:100%'>
                    <tm-select
                      class={isNotCreate?'tr-input-readonly subCondition':' subCondition'}
                      tabIndex={isNotCreate?'-1':'0'}
                      v-model={WarnSubObj.value.NoticeSet.NoticeContentType}
                      onConfirm={NoticeContent}
                      hideLabel={true}
                      Label={$q.lang.queryPlan.subWarning.choise}
                      title={$q.lang.queryPlan.subWarning.choise}
                      HelpPlacement='bottom'
                      placeholder={$q.lang.queryPlan.subWarning.choise}
                     staticItems={
                        settingConfig.value.SubscriptionNoticeContentType
                      }
                      itemsDataSourceType='static'

                      textAlign='left'
                      
                      style='with:100%'
                      {...(isReadOnly.value ? { readonly: true } : {})}
                    />
                  </div>
                </p>
              );
            }
          })()}

          <p>
            <span>{$q.lang.queryPlan.subWarning.noticeContent}</span>
            <div class='subConditionDataNumber' style='width:100%'>
              <textarea  
                value={WarnSubObj_NoticeContent.value}
                name=''
                id=''
                cols='30'
                rows='16'
                readonly
                style='width:100%;height:136px;border:1px solid #ccc;padding:8px;line-height:1.5;color:rgba(0,0,0,.8)'
              ></textarea>
            </div>
          </p>
          {(() => {
            if (WarnSubObj.value.NoticeSet.NoticeType != 0) {
              return (
                <div>
                  <p>
                    <span>Token</span>
                    <div class='subConditionDataNumber' style='width:100%'>
                      <t-input
                       class={isNotCreate?'tr-input-readonly':''}
                      tabIndex={isNotCreate?'-1':'0'}
                        type='text'
                        borderType='borderless'
                        style='margin-top:0'
                        placeholder={$q.lang.queryPlan.subWarning.tokenPlaceholder}
                        {...(isReadOnly.value ? { readonly: true } : {})}
                        v-model={WarnSubObj.value.NoticeSet.TokenInfo}
                      />
                    </div>
                  </p>
                  <p>
                    <span>Secret</span>
                    <div class='subConditionDataNumber' style='width:100%'>
                      <t-input
                       class={isNotCreate?'tr-input-readonly':''}
                      tabIndex={isNotCreate?'-1':'0'}
                      borderType='borderless'
                      placeholder={$q.lang.queryPlan.subWarning.secretPlaceholder}
                        type='text'
                        style='margin-top:0'
                        {...(isReadOnly.value ? { readonly: true } : {})}
                        v-model={WarnSubObj.value.NoticeSet.SecretInfo}
                      />
                    </div>
                  </p>
                  <p>
                    <span>
                      <tm-checkbox
                      
                      tabIndex={isNotCreate?'-1':'0'}
                        class="sub_IsNeedAtPerson"
                        shape='square'
                        v-model={WarnSubObj.value.NoticeSet.IsNeedAtPerson}
                        {...(isReadOnly.value ? { disabled: true } : {})}
                      >
                       {$q.lang.queryPlan.subWarning.notifyPerson}
                      </tm-checkbox>
                    </span>
                    <div class='subConditionDataNumber' style='width:100%'>
                      <tm-select
                       class={isNotCreate?'tr-input-readonly subCondition ':' subCondition'}
                      tabIndex={isNotCreate?'-1':'0'}
                        v-model={WarnSubObj.value.NoticeSet.PersonField}
                        onConfirm={NoticeContent}
                        hideLabel={true}
                        label={$q.lang.queryPlan.subWarning.choise}
                        title={$q.lang.queryPlan.subWarning.choise}
                        helpPlacement='bottom'
                        placeholder={$q.lang.queryPlan.subWarning.choise}
                       staticItems={(() => {
                          return filterServer.value?.map(item => {
                            return {
                              label: item.fieldName,
                              value: item.fieldAlias,
                            };
                          });
                        })()}
                        itemsDataSourceType='static'

                        textAlign='left'
                
                        {...(isReadOnly.value ? { readonly: true } : {})}
                      />
                    </div>
                  </p>
                </div>
              );
            }
          })()}
        </div>
      );
    }; 
    const  getFoucusDom = ref(null)
    const renderSubWarningContent = () => {
      if (active.value == 1) {
        return renderBasicInfo(false);
      } else if (active.value == 2) {
        return renderSubInfo(false);
      } else if (active.value == 3) {
        return renderNotifyInfo(false);
      }
    };
  const refTPopupProxy = ref(null);
  const preventDefault = (e)=>{
    if(e.keyCode==9){
      e.stopPropagation();
      e.preventDefault();
      return false;
    }
   
  }
  watch(
    () => showSubWarning.value,
    () => {
      if (showSubWarning.value) {
        refTPopupProxy.value.show();
      } else {
        refTPopupProxy.value.hide();
      }
    },
  );
    const render = () => {

      return (
        <tm-popup
          lock-scroll={true}
          ref={refTPopupProxy}
          class='queryplanContent'
          showClose={true}
          v-model:show={showSubWarning.value}
          // 如果设置为false 组件限制无法全屏
          maximized={false}

          onShow={() => {
            showSubWarning.value = true;
            emit('update:showSubWarning', true);
          }}
          onHide={() => {
            showSubWarning.value = false;
            emit('update:showSubWarning', false);
            setTimeout(() => {
              targetDom.value&&targetDom.value.focus()
            },400);
          
          }}
        >
          <div style='background:#fff;width:660px;min-width:660px;max-height:758px'>
            <header ref={getFoucusDom} class='sub-warning-header' tabindex={0} style={'outline:0;border:0'}>
              {/* <tm-icon
                name='chevron_left'
                onClick={() => {
                  emit('update:showSubWarning', false);
                }}
                style='position:absolute;left:20px'
              /> */}
              <span class='plan_dialog_header_title'>
                {modifyPlan.value.WarningID
                  ? modifyPlan.value.IsAuth
                    ? $q.lang.queryPlan.subWarning.cancelSubWarning
                    : $q.lang.queryPlan.subWarning.viewSubWarning
                  : $q.lang.queryPlan.subWarning.subWarning}
              </span>
              <tm-icon
                name='close'
                onClick={() => {
                  emit('update:showSubWarning', false);
                }}
                style='position:absolute;right:24px;font-size:14px'
              />
            </header>
            {(() => {
              if (!modifyPlan.value.WarningID) {
                return (
                  <div>
                    <div >
                      <div  style='width:80%;margin-left:10%'>
                      <tm-steps
                        v-model={active.value}
                        style='border:0'
                        class='subwarning-q-stepper'
                        isShowNav={false}
                        staticItems={
                          [{
                          name: 1,
                          title: $q.lang.queryPlan.subWarning.stepInfo[0],

                          done: active.value > 1
                        },
                        {
                          name: 2,
                          title: $q.lang.queryPlan.subWarning.stepInfo[1],

                          done: active.value > 2
                        },
                        {
                          name: 3,
                          title: $q.lang.queryPlan.subWarning.stepInfo[2],

                          done:active.value > 3
                        }
                      ]}
                      >
                        {/* <q-step name={1} title='基础信息' icon='check' active-icon='none' done={active.value > 1}></q-step>
                        <q-step name={2} title='订阅信息' icon='check' active-icon='none' done={active.value > 2}></q-step>
                        <q-step name={3} title='通知信息' icon='check' active-icon='none' done={active.value > 3}></q-step> */}
                      </tm-steps>
                      </div>

                      {renderSubWarningContent()}
                    </div>
                    <div class='subwarning_foot'>
                      {(() => {
                        if (active.value != 1) {
                          return (
                            <tm-button
                              class='tr-button-text'
                 
                              style='margin-right:10px;border:1px solid #DCDCDC;color: rgba(0, 0, 0, var(--t-color-opacity, /*批量处理90%透明度*/0.9))'
                              tabIndex="0"
                              onClick={() => {
                                if (active.value > 0) {
                                  active.value--;
                                  setTimeout(() => {
                                    let header = document.querySelector('.sub-warning-header')
                                    header&&header.focus()&&header.click()
                                  }, 100);
                                }
                              }}
                            >
                              {$q.lang.queryPlan.subWarning.prevStep}
                            </tm-button>
                          );
                        }
                      })()}

                      {(() => {
                        if (active.value < 3) {
                          return (
                            <tm-button
                              class='tr-button-primary'
                     
                              tabIndex="0"
                              onClick={() => {
                                if (active.value == 1){
                                  if(!WarnSubObj.value.Name){

                                    Funcs.Notify($q.lang.selectHelper.warning, $q.lang.queryPlan.subWarning.subWarningNameisNotEmpt, 'warning')
                                    return;
                                  }
                                }else if (active.value == 2) {
                                  if(WarnSubObj.value.TriggerType == 3){
                                    if(!WarnSubObj.value.ComplexTriggerConditionView.CompareValue|| !/(^[1-9]\d*$)/.test(
                                        WarnSubObj.value.ComplexTriggerConditionView .CompareValue
                                      )){
                                      return  Funcs.Notify($q.lang.selectHelper.warning,  $q.lang.queryPlan.subWarning.isInt, 'warning')
                                      }
                                  }else{
                                    delete WarnSubObj.value.ComplexTriggerConditionView.CompareValue;
                                  }
                                  if (
                                    WarnSubObj.value.ExecuteFrequency
                                      .SysFrequencies.length == 0
                                  ) {
                                    Funcs.Notify($q.lang.selectHelper.warning, $q.lang.queryPlan.subWarning.rateIsNotEmpt, 'warning')

                                    return;
                                  }
                                }
                                active.value++;
                                setTimeout(() => {
                                  let header = document.querySelector('.sub-warning-header')
                                  header&&header.focus()&&header.click()
                                }, 100);
                              }}
                              onkeydown={(e)=>{preventDefault(e)}}
                            >
                               {$q.lang.queryPlan.subWarning.nextStep}
                            </tm-button>
                          );
                        } else {
                          return (
                            <tm-button
                              class='tr-button-primary'
                   
                              tabIndex="0"
                              onClick={() => {
                                if (WarnSubObj.value.NoticeSet.NoticeType == 1) {
                                  if (!WarnSubObj.value.NoticeSet.TokenInfo) {
                                    // this.Notify("warning", Terms.notify.TokenInfo);
                                    Funcs.Notify($q.lang.selectHelper.warning, $q.lang.queryPlan.subWarning.tokenIsNotEmpt, 'warning')

                                    return;
                                  }
                                  if (!WarnSubObj.value.NoticeSet.SecretInfo) {
                                    Funcs.Notify($q.lang.selectHelper.warning,  $q.lang.queryPlan.subWarning.secrtIsNotEmpt, 'warning')

                                    return;
                                  }
                                  if (
                                    WarnSubObj.value.NoticeSet.IsNeedAtPerson &&
                                    !WarnSubObj.value.NoticeSet.PersonField
                                  ) {
                                    Funcs.Notify($q.lang.selectHelper.warning,  $q.lang.queryPlan.subWarning.notifyPersonIsNotEmpt, 'warning')

                                    return;
                                  }
                                }
                                WarnSubObj.value.NoticeSets = [
                                  WarnSubObj.value.NoticeSet,
                                ];
                                WarnSubObj.value.Description =
                                  WarnSubObj.value.Name;
                                if (WarnSubObj.value.TriggerType != 3) {
                                  delete WarnSubObj.value.ComplexTriggerConditionView.CompareValue;
                                }
                                WarnSubObj.value.ComplexTriggerCondition =
                                  JSON.stringify(
                                    WarnSubObj.value
                                      .ComplexTriggerConditionView,
                                  );
                                WarnSubObj.value.LinkUrl = document.URL;
                                let dParameters = [];
                                let dataSource = ref(
                                  dataQuery.value
                                    ? JSON.parse(dataQuery.value)
                                    : null,
                                );
                                if (dataSource.value) {
                                  WarnSubObj.value.JSContent = dataSource.value
                                    .DataBind
                                    ? dataSource.value.DataBind
                                    : dataSource.value.DisplayInfo; // DQ的数据源——春辉（查询方案的数据源）  Widget.fas_advquery
                                  dParameters = dataSource.value.Parameters;
                                }
                                let pLength = dParameters.length;
                                let JSContentParams = {};
                                for (let i = 0; i < pLength; i++) {
                                  let pCode = dParameters[i].Code;
                                  if (pCode == 'AdvancedFilter') {
                                    JSContentParams['AdvancedFilter'] = FilterExpression(modifyPlan.value,filterServer.value)

                                  } else {
                                    JSContentParams[dParameters[i].Code] = null;
                                  }
                                }
                                WarnSubObj.value.JSContentParams =
                                  JSON.stringify(JSContentParams);
                                WarnSubObj.value.BusinessName = pageName.value;
                                //pageID.value ?? '';
                                WarnSubObj.value.BusinessType = pageCode.value;
                                // pageID.value ?? '';
                                CreateScheduleJobSubscription(
                                  WarnSubObj.value,
                                ).then(res => {
                                  if (res.data) {
                                    Funcs.Notify($q.lang.selectHelper.warning, $q.lang.queryPlan.subWarning.subSuccess, 'success')

                                    emit('update:showSubWarning', false);
                                    emit('subWarning', res.data);
                                  } else {
                                    Funcs.Notify($q.lang.selectHelper.warning, $q.lang.queryPlan.subWarning.subFail.format(res.message) , 'warning')

                                  }
                                });
                              }}
                              onkeydown={(e)=>{preventDefault(e)}}
                            >
                              {$q.lang.label.ok}
                            </tm-button>
                          );
                        }
                      })()}
                    </div>
                  </div>
                );
              } else {
                return (
                  <div>
                    <div style='height:calc(80vh - 110px);overflow:auto'>
                      {renderBasicInfo(true)}
                      {renderSubInfo(true)}
                      {renderNotifyInfo(true)}
                    </div>
                    <div class='subwarning_foot'>


                      {(() => {
                        if (modifyPlan.value.IsAuth) {
                          return (
                            <tm-button
                            class='tr-button-primary'
               
                            style={modifyPlan.value.IsAuth?'margin-right:10px;border:1px solid #DCDCDC':''}
                            onClick={() => {
                              emit('update:showSubWarning', false);
                            }}
                         
                          >
                            {$q.lang.label.close}
                          </tm-button>
                          );
                        }else{
                          return  <tm-button
                          class='tr-button-primary'
                     
                          tabIndex="0"
                          style={modifyPlan.value.IsAuth?'margin-right:10px':''}
                          onClick={() => {
                            emit('update:showSubWarning', false);
                          }}
                          onkeydown={(e)=>{preventDefault(e)}}
                        >
                         {$q.lang.label.close}
                        </tm-button>
                        }
                      })()}
                      {(() => {
                        if (modifyPlan.value.IsAuth) {
                          return (
                            <tm-button
                              class='tr-button-primary'
                 
                              tabIndex="0"
                              onClick={() => {
                                CancleScheduleJobSubscription(
                                  modifyPlan.value.WarningID,
                                ).then(res => {
                                  if (res.state == 1) {
                                    Funcs.Notify($q.lang.selectHelper.warning, $q.lang.queryPlan.subWarning.cancelSubSuceess, 'success')

                                    emit('update:showSubWarning', false);
                                    emit('subWarning', 'cancel');
                                  } else {
                                    Funcs.Notify($q.lang.selectHelper.warning, $q.lang.queryPlan.subWarning.cancelSubFail.format(res.message), 'warning')

                                    emit('update:showSubWarning', false);
                                    emit('subWarning', 'cancel');
                                  }
                                });
                              }}
                              onkeydown={(e)=>{preventDefault(e)}}
                            >
                               {$q.lang.queryPlan.subWarning.cancelSub}
                            </tm-button>
                          );
                        }
                      })()}
                    </div>
                  </div>
                );
              }
            })()}
          </div>
        </tm-popup>
      );
      // return <span>1111</span>;
    };
    return render;
  },
});
